import React from 'react';
import {HeartTwoTone, SmileTwoTone} from '@ant-design/icons';
import {Card, Typography, Alert} from 'antd';
import {Popconfirm, Space, Menu, Dropdown} from 'antd';
import {PageHeaderWrapper} from '@ant-design/pro-layout';
import {useIntl} from 'umi';
import ProCard from '@ant-design/pro-card';
import {useState, useRef} from 'react';
import {ProColumns} from '@ant-design/pro-table';
import ProTable from '@ant-design/pro-table';
import {DownOutlined} from '@ant-design/icons';
import {PageContainer, FooterToolbar} from '@ant-design/pro-layout';
import ProForm, {
  ProFormSwitch,
  ProFormText,
  ProFormRadio,
  ProFormCheckbox,
  ProFormRate,
  ProFormSelect,
  ProFormDigit,
  ProFormSlider,
  ProFormGroup,
} from '@ant-design/pro-form';

const Authentication = () => {
  const intl = useIntl();

  const policies = [
    {
      "objectAttribute": "title",
      "subjectAttribute": "匿名人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "匿名人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "初级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "初级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "初级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "初级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "初级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "初级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "初级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "初级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "初级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "初级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "中级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "中级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "中级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "中级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "中级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "中级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "offset",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string_cn",
      "subjectAttribute": "中级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "offset",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string_cn",
      "subjectAttribute": "中级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "offset",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string_cn",
      "subjectAttribute": "高级人员",
      "operation": "搜索",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "offset",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string_cn",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "id",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string",
      "subjectAttribute": "高级人员",
      "operation": "查询",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "offset",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string_cn",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "id",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string",
      "subjectAttribute": "高级人员",
      "operation": "删除",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "title_cn",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "source",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "date",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "content_id",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "flat",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "offset",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string_cn",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "id",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    },
    {
      "objectAttribute": "string",
      "subjectAttribute": "高级人员",
      "operation": "导入",
      "environment": "OSX"
    }
  ]
  const userLevels = ["高级人员", "中级人员", "低级人员", "匿名人员"]
  const userLevelsMap = {
    super: '高级人员',
    middle: '中级人员',
    low: '低级人员',
    anony: '匿名人员',
  }
  const [count, setCount] = useState(1)
  const [targetUser, setTargetUser] = useState("4")
  const [targetUserLevel, setTargetUserLevel] = useState(userLevels[3])
  const [authority, setAuthority] = useState(policies)
  const [attrs, setAttrs] = useState([])
  const [userLevel, setUserLevel] = useState("高级人员")


  const operationMenu = (
    <Menu>
      <Menu.Item key="search">搜素</Menu.Item>
      <Menu.Item key="resolve">查询</Menu.Item>
      <Menu.Item key="import">导入</Menu.Item>
      <Menu.Item key="delete">删除</Menu.Item>
    </Menu>
  );


  //TODO @liuyi init
  const init = () => {


    //获取指定用户的权限
    const tmp = []
    for (const item in authority) {
      if (authority[item]['subjectAttribute'] === userLevel) {
        if (authority[item]['operation'] == '搜索') {
          tmp.push(authority[item]['objectAttribute'])
        }
      }
    }

    console.log(tmp)

    setAttrs(tmp)
  }


  //获取授权方式，修改相应的state状态
  const authInfo = (info) => {
    console.log(info)
    if ("targetUser" in info) {
      setTargetUserLevel(userLevelsMap[info.targetUser])
    } else if ("count" in info) {
      setCount(info.count)
    } else {
      setTargetUser(info.user)
    }
  }


  const AuthDetail = () => {
    const data = [
      {"index": 1, "name": "title", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "title_cn", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "source", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "date", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "content_id", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "date", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "string", "level": "初级人员", "category": "搜索"},
      {"index": 2, "name": "string_cn", "level": "初级人员", "category": "搜索"},
    ]


    const levelMenu = (
      <Menu>
        <Menu.Item key="super">高级人员</Menu.Item>
        <Menu.Item key="middle">中级人员</Menu.Item>
        <Menu.Item key="low">低级人员</Menu.Item>
        <Menu.Item key="anony">匿名人员</Menu.Item>
      </Menu>
    );


    const columns = [
      {
        dataIndex: 'index',
        title: '编号',
      },
      {
        dataIndex: 'name',
        title: '字段名称',
      },
      {
        dataIndex: 'level',
        title: '权限级别',
        render: (_, record) => (
          <Dropdown overlay={levelMenu}>
            <span>
              {targetUserLevel} <DownOutlined/>
            </span>
          </Dropdown>
        ),
      },
      {
        dataIndex: 'category',
        title: '权限类别',
        render: (_, record) => (
          <Dropdown overlay={operationMenu}>
            <span>
              {"搜索"} <DownOutlined/>
            </span>
          </Dropdown>
        ),
      },
    ];


    return (
      <ProTable
        columns={columns}
        request={(params, sorter, filter) => {
          // 表单搜索项会从 params 传入，传递给后端接口。
          console.log(params, sorter, filter);
          return Promise.resolve({
            data: data,
            success: true,
          });
        }}
        rowKey="authDetail"
        pagination={{
          showQuickJumper: true,
        }}
        toolBarRender={false}
        search={false}
      />
    );
  }


return (
    <
  PageContainer >
  < Alert
  message = {
    intl.formatMessage({
      id: 'pages.welcome.alertMessage',
      defaultMessage: 'Faster and stronger heavy-duty components have been released.',
    })
  }
  type = "success"
  showIcon
  banner
  style = {
  {
    margin: -12,
    marginBottom: 48,
  }
}
  />

  <ProCard>
    <ProCard colSpan={{xs: 2, sm: 4, md: 6, lg: 8, xl: 10}} layout="center">
      <ProForm
        onValuesChange={(changeValues) => authInfo(changeValues)}
      >
        <ProFormText width="md" name="user" label="请输入授权用户标识"/>
        <ProFormSelect
          name="targetUser"
          label="请选择要授予的访问权限"
          valueEnum={userLevelsMap}
          placeholder="请选择要授予的访问权限"
          rules={[{required: true, message: '请选择要授予的访问权限'}]}
        />
        <ProFormDigit label="请输入授权的访问次数" name="count" width="sm" min={1} max={10000}/>
      </ProForm>
    </ProCard>

    <ProCard colSpan={{xs: 2, sm: 4, md: 6, lg: 8, xl: 10}} layout="center">
      {AuthDetail()}
    </ProCard>

  </ProCard>
</PageContainer>
);
};
export default Authentication;
